<template>
  <div>
    <el-button type="primary" size="default" @click="addAdv">新增</el-button>
    <el-dialog
      title="广告详情"
      :visible.sync="isMaskShow"
      width="60%"
      @close="close"
    >
      <el-form ref="form" :model="form" label-width="80px" :inline="false" size="mini">
        <el-row :gutter="20">
          <el-col :span="12" :offset="0">
            <el-form-item label="广告名称">
              <el-input v-model="form.name" />
            </el-form-item>
          </el-col>
          <el-col :span="12" :offset="0">
            <el-form-item label="备注">
              <el-input v-model="form.note" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12" :offset="0">
            <el-form-item label="排序">
              <el-input v-model="form.sort" />
            </el-form-item>
          </el-col>
          <el-col :span="12" :offset="0">
            <el-form-item label="产品数量">
              <el-input v-model="form.orderCount" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12" :offset="0">
            <el-form-item label="链接">
              <el-input v-model="form.url" />
            </el-form-item>
          </el-col>
          <el-col :span="12" :offset="0">
            <el-form-item label="轮播位置">
              <el-select v-model="form.type" value-key="" placeholder="" clearable filterable @change="">
                <el-option
                  label="app首页轮播"
                  :value="0"
                />
              </el-select>

            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12" :offset="0">
            <el-form-item label="开始时间">
              <el-date-picker
                v-model="form.startTime"
                value-format="yyyy-M-dd HH:hh:ss"
                type="datetime"
                placeholder="选择日期时间"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12" :offset="0">
            <el-form-item label="结束时间">
              <el-date-picker
                v-model="form.endTime"
                value-format="yyyy-M-dd HH:hh:ss"
                type="datetime"
                placeholder="选择日期时间"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12" :offset="0">
            <el-form-item label="上下线状态">
              <el-switch v-model="form.status" />

            </el-form-item>
          </el-col>
          <el-col :span="12" :offset="0">
            <el-form-item label="图片">
              <el-input v-model="form.pic" />
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>

      <span slot="footer">

        <el-button type="primary" @click="save">OK</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
import {
  addAds
} from '@/api/marketManage/advList'
export default {
  data() {
    return {
      isMaskShow: false,
      form: {
        'clickCount': '',
        'createTime': '', // 2022-10-01 19:45:30
        'endTime': '',
        'id': '',
        'modifyTime': '',
        'name': '',
        'note': '',
        'orderCount': '',
        'pic': '',
        'productId': '',
        'sort': '',
        'startTime': '',
        'status': '',
        'type': '',
        'url': ''
      }
    }
  },
  computed: {

  },
  created() {

  },
  mounted() {

  },
  methods: {
    save() {
      var params = JSON.parse(JSON.stringify(this.form))
      params.status = params.status ? 1 : 0
      addAds(params)
        .then(res => {
          this.isMaskShow = !this.isMaskShow
        })
    },
    close() {

    },
    addAdv() {
      this.isMaskShow = !this.isMaskShow
    }
  }
}
</script>

<style scoped lang="scss">

</style>
